<template>
  <!--分配角色-->
  <div class="search">
    <a-form-model :model="form" ref="userRole">
      <a-form-model-item prop="roleIds">
        <a-transfer
          :dataSource="roleList"
          v-model="form.roleIds"
          :listStyle="{width: '45%',height: '480px'}"
          :titles="['选择角色', '已选择角色']"
          :render="item=>item.title"
          :target-keys="form.roleIds"
          @change="handleTransferChange"
          filterable>
        </a-transfer>
      </a-form-model-item>
    </a-form-model>

  </div>
</template>

<script>
  export default {
    name: 'userRole',
    props: {},
    data() {
      return {
        roleList: [],
        form: {
          userId: '',
          roleIds: []
        }
      }
    },
    methods: {
      setData(data) {
        if (data && data.userId) {
          this.form.userId = data.userId
          this.form.organizationId = data.organizationId
          this.getAuthRoleList(data.userId,data.organizationId)
        }
      },
      handleSubmit() {
        this.$refs['userRole'].validate(valid => {
          if (valid) {
            this.http.post(this, {
              url: this.api.managerUser.setRole,
              data: {
                userId: this.form.userId,
                roleIds: this.form.roleIds.join(',')
              },
              success: function(me) {
                me.$emit('handleClose')
              }
            })
          } else {
            return false
          }
        })
      },
      handleTransferChange(targetKeys, direction, moveKeys) {
        this.form.roleIds = targetKeys
      },
      getAuthRoleList(userId,organizationId) {
        this.http.get(this, {
          url: this.api.role.getAuthRoleList,

          data: {
            organizationId:organizationId,
            userId: userId
          },
          success: (me, data) => {
            data.roleList.map(item => {
              item.key = item.roleId
              item.title = item.roleName
            })
            me.roleList = data.roleList
            me.form.roleIds = data.roleIds
          }
        })
      }
    },
    created() {

    },
    components: {}
  }
</script>

<style scoped lang="less" rel="stylesheet/less">

</style>
